<!DOCTYPE HTML>
<html>
<head>
<#include "/adminPage/common.html"/>
<style type="text/css">
.layui-form-label {
	width: 150px;
}

.layui-input-block {
	margin-left: 180px;
}

.path{
	display: inline-block;
	width: 120px;
}
.value{
	display: inline-block;
}
.liteBtn{
	width: 90px;
}

</style>
</head>
<body class="layui-layout-body">
	<div class="layui-layout layui-layout-admin" >

		<#include "/adminPage/header.html"/>
		<#include "/adminPage/menu.html"/>

		<div class="layui-body">
			<!-- 内容主体区域 -->
			<div style="padding: 15px">
				<fieldset class="layui-elem-field layui-field-title">
					<legend>反向代理</legend>
				</fieldset>

				<form action="${ctx}/adminPage/server" id="searchForm" method="post">
					<div class="layui-form">
						<div class="layui-inline">
							<button type="button" class="layui-btn layui-btn-normal" onclick="add()">添加反向代理</button>
						</div>

						<input type="hidden" name="curr" value="${page.curr}">
					</div>
				</form>

				<table class="layui-table">
					<thead>
						<tr>
							<th>转发类型</th>
							<th>监听端口</th>
							<th>监听域名</th>
							<th>开启ssl</th>
							<th>http自动跳转https</th>
							<th>ssl文件路径</th>
							<th>代理目标</th>
							<th>操作</th>
						</tr>
					</thead>
					<tbody>
						<#list page.records as ext>
						<tr>
							<td>
								<#if ext.server.proxyType==0>http</#if>
								<#if ext.server.proxyType==1>TCP</#if>
							</td>
							<td>${ext.server.listen}</td>
							<td>
								<#if ext.server.serverName==''>全部</#if>
								<#if ext.server.serverName!=''>${ext.server.serverName}</#if>
							</td>
							<td>
								<#if ext.server.ssl==0>否</#if>
								<#if ext.server.ssl==1>是</#if>
							</td>
							<td>
								<#if ext.server.ssl==1> 
									<#if ext.server.rewrite==0>否</#if> 
									<#if ext.server.rewrite==1>是</#if> 
								</#if>
							</td>
							<td>
								<#if ext.server.ssl==1> pem: ${ext.server.pem} <br>
								key: ${ext.server.key} </#if>
							</td>
						
							
							<td>
								${ext.locationStr} 
							</td>

							<td>
								<button class="layui-btn layui-btn-sm" onclick="edit('${ext.server.id}')">编辑</button>
								<button class="layui-btn layui-btn-danger layui-btn-sm" onclick="del('${ext.server.id}')">删除</button>
							</td>
						</tr>
						</#list>
					</tbody>
				</table>
				<div id="pageInfo"></div>
			</div>
		</div>
	</div>

	<div style="height: 0px; width: 0px; overflow: hidden;">
		<!-- 弹出框 -->
		<div class="layui-form" id="windowDiv" style="padding: 15px; display: none">
			<form id="addForm">
				<input type="hidden" id="id" name="id">
				
				<div class="layui-form-item" style="padding: 0 15px;">
					<label class="layui-form-label">转发类型</label>
					<div class="layui-input-inline">
						<select name="proxyType" id="proxyType" lay-filter="proxyType">
							<option value="0">http</option>
							<option value="1">TCP</option>
						</select>
					</div>
					
					<div class="proxyTcp">
						<label class="layui-form-label">指向负载均衡</label>
						<div class="layui-input-inline">
							<select name="proxyUpstreamId">
								<#list upstreamTcpList as upstream>
								<option value="${upstream.id}">${upstream.name}</option>
								</#list>
								
								<#if upstreamTcpSize == 0>
								<option value="">--无可用负载均衡--</option>
								</#if>
							</select>
						</div>
					</div>
					
					
					<div class="pemDiv">
						<label class="layui-form-label"></label>
						<div class="layui-input-black">
							<button type="button" class="layui-btn layui-btn-sm layui-btn-normal liteBtn" onclick="selectCert()">选择内置证书</button>
							<div class="layui-form-mid layui-word-aux"></div>
						</div>
					</div>
					
					
				</div>
							
				<div class="layui-container" >
					<div class="layui-row">
						<div class="layui-col-md4">
							<div class="layui-form-item">
								<label class="layui-form-label">监听端口<span class="red">*</span></label> 
								<div class="layui-input-inline">
									<input type="number" name="listen" id="listen" class="layui-input" placeholder="例: 80">
								</div>
							</div>
							
							<div class="proxyHttp">
								<div class="layui-form-item">
									<label class="layui-form-label">监听域名</label>
									<div class="layui-input-inline">
										<input type="text" name="serverName" id="serverName" class="layui-input" placeholder="例: www.baidu.com">
									</div>
								</div>
	
								<div class="layui-form-item">
									<label class="layui-form-label">开启ssl</label>
									<div class="layui-input-inline">
										<select name="ssl" id="ssl" lay-filter="ssl">
											<option value="0">否</option>
											<option value="1">是</option>
										</select>
									</div>
								</div>
							</div>
						</div>
						<div class="layui-col-md8 proxyHttp">
							<div class="pemDiv"  style="display: none;">
								<div class="layui-form-item">
									<label class="layui-form-label">pem文件路径</label>
									<div class="layui-input-block">
										<button type="button" class="layui-btn layui-btn-sm liteBtn" id="pemBtn">上传pem文件</button>
										
										<button type="button" class="layui-btn layui-btn-sm layui-btn-normal liteBtn" onclick="selectPem()">选择系统路径</button>
										
										<input type="hidden" name="pem" id="pem" class="layui-input">
										<div class="layui-form-mid layui-word-aux" id="pemPath"></div>
										
									</div>
								</div>
								<div class="layui-form-item">
									<label class="layui-form-label">key文件路径</label>
									<div class="layui-input-block">
										<button type="button" class="layui-btn layui-btn-sm liteBtn" id="keyBtn">上传key文件</button>
										
										<button type="button" class="layui-btn layui-btn-sm layui-btn-normal liteBtn" onclick="selectKey()">选择系统路径</button>
										
										<input type="hidden" name="key" id="key" class="layui-input">
										<div class="layui-form-mid layui-word-aux" id="keyPath"></div>
									</div>
								</div>

								<div class="layui-form-item">
									<label class="layui-form-label">http自动跳转https</label>
									<div class="layui-input-inline">
										<select name="rewrite" id="rewrite">
											<option value="1">是</option>
											<option value="0">否</option>
										</select>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>

				<div class="layui-form-item">
					<button type="button" class="layui-btn layui-btn-sm" style="margin-left: 195px;" onclick="serverParam()">设置额外参数</button>
					<input type="hidden" id="serverParamJson" name="serverParamJson" value="">
				</div>
					
				<div class="layui-form-item">
					<button type="button" class="layui-btn layui-btn-sm layui-btn-normal proxyHttp" onclick="addItem()">添加代理目标</button>
				</div>

				<div class="layui-form-item proxyHttp">
					<table class="layui-table">
						<thead>
							<tr>
								<th>监控路径</th>
								<th>代理类型</th>
								<th>代理目标</th>
								<th>操作</th>
							</tr>
						</thead>
						<tbody id="itemList">

						</tbody>
					</table>
				</div>


				<div class="layui-form-item">
					<button type="button" class="layui-btn layui-btn-normal" onclick="addOver()">提交</button>
					<button type="button" class="layui-btn" onclick="layer.closeAll()">关闭</button>
				</div>
			</form>
		</div>
		
		<div id="paramJsonDiv" style="display: none;padding: 15px;"> 
			<div class="layui-form-item">
				<button type="button" class="layui-btn layui-btn-sm layui-btn-normal" onclick="addParam()">添加参数</button>
			</div>
			<div class="layui-form-item">
				<input type="hidden" id="targertId" >
				<table class="layui-table">
					<thead>
						<tr>
							<th>名称</th>
							<th>值</th>
							<th>操作</th>
						</tr>
					</thead>
					<tbody id="paramList">

					</tbody>
				</table>
			</div>

			<div class="layui-form-item">
				<button type="button" class="layui-btn layui-btn-normal" onclick="addParamOver()">提交</button>
				<button type="button" class="layui-btn" onclick="layer.close(paramIndex)">关闭</button>
			</div>
		</div>

		<div id="upstreamSelect" style="display: none;"> 
			<select name="upstreamId">
				
				<#list upstreamList as upstream>
				<option value="${upstream.id}">${upstream.name}</option>
				</#list>
				
				<#if upstreamSize == 0>
				<option value="">--无可用负载均衡--</option>
				</#if>
			</select>
		</div>
		
		<div id="certDiv"  style="padding: 15px; display: none"> 
			<div class="layui-form">
				<div class="layui-form-item">
					<label class="layui-form-label">内置证书</label>
					<div class="layui-input-inline">
						<select name="certId" id="certId">
							<#list certList as cert>
								<option value="${cert.id}">${cert.domain}</option>
							</#list>
						</select>
					</div>
				</div>

				<div class="layui-form-item">
					<button type="button" class="layui-btn layui-btn-normal" onclick="selectCertOver()">提交</button>
					<button type="button" class="layui-btn" onclick="layer.close(certIndex)">关闭</button>
				</div>
			</div>
		</div>
	</div>

	<#include '/adminPage/script.html'/>
	<#include '/adminPage/select_root.html'/>
	<script src="${ctx}/js/adminPage/server/index.js?v=${jsrandom}" type="text/javascript"></script>
</body>


</html>